﻿<%@ Page Title="" Language="C#" MasterPageFile="~/EventsParent.Master" AutoEventWireup="true" CodeBehind="Event.aspx.cs" Inherits="WebFrontEnd.Event" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    <link rel="stylesheet" href="css/jquery.timeentry.css" />
    <script src="js/jquery.timeentry.min.js"></script>
    <link href="css/select2.css" rel="stylesheet" />
    <script type="text/javascript" src="js/select2.min.js"></script>
    <link href="css/jquery.countdown.css" rel="stylesheet" />
    <script type="text/javascript" src="js/jquery.countdown.js"></script>
    <script type="text/javascript" src="js/purl.js"></script>
    <link href="css/jtable-themes/lightcolor/gray/jtable.min.css" rel="stylesheet" />
    <script type="text/javascript" src="js/jquery.jtable.min.js"></script>
    <script type="text/javascript" src="js/jquery.jtable.aspnetpagemethods.min.js"></script>
    <script type="text/javascript" src="js/Event.js"></script>
    <script type="text/javascript">
        $(function () {
            var CurrencyHash = [
                { 'ShortName': 'USD', 'Symbol': '$' },
                { 'ShortName': 'ILS', 'Symbol': '₪' },
                { 'ShortName': 'GBP', 'Symbol': '£' },
                { 'ShortName': 'EUR', 'Symbol': '€' },
                { 'ShortName': 'AUD', 'Symbol': '$' }
            ];
            YorkinPage.InitializePage({
                DateOfEventInput: "<% Response.Write(DateOfEventInput.ClientID); %>",
                TimeOfEventInput: "<% Response.Write(TimeOfEventInput.ClientID); %>",
                GuestSearchBox: "<% Response.Write(GuestSearchBox.ClientID); %>",
                HallInput: "<% Response.Write(HallInput.ClientID); %>",
                countdownRow: "<% Response.Write(countdownRow.ClientID); %>",
                startCount: "<% Response.Write(startCount.ClientID); %>",
                AddGuestButton: "AddGuestButton",
                guestNameLabel: "guestNameLabel",
                eventNameLabel: "eventNameLabel",
                eventNameInput: "<% Response.Write(eventName.ClientID); %>",
                addNewGuestModal: "addNewGuestModal",
                additionalGuestsInput: "additionalGuestsInput",
                InviteGuestButton: "InviteGuestButton",
                InviteGuestAjaxLoader: "InviteGuestAjaxLoader",
                totalGuestsInvited: "<% Response.Write(totalGuestsInvited.ClientID); %>",
                totalGuestsComing: "<% Response.Write(totalGuestsComing.ClientID); %>",
                totalGuestsRSVPd: "<% Response.Write(totalGuestsRSVPd.ClientID); %>",
                GuestsTable: "GuestsTable",
                rsvpModal: "rsvpModal",
                rsvpAjaxLoader: "rsvpAjaxLoader",
                rsvpCheckBox: "rsvpCheckBox",
                rsvpGuestsInput: "rsvpGuestsInput",
                updateRsvpButton: "updateRsvpButton",
                giftModal: "giftModal",
                'CurrencyHash': CurrencyHash,
                GiftValueArea: 'GiftValueArea',
                GiftTypeSelect: 'GiftTypeSelect',
                DescriptionTextarea: 'DescriptionTextarea',
                CheckDepositDate: 'CheckDepositDate',
                StoreBoughtInput: 'StoreBoughtInput',
                GiftNameInput: 'GiftNameInput',
                GiftHeader: 'GiftHeader',
                UpdateGiftBtn: 'UpdateGiftBtn',
                GiftLoader: 'GiftLoader', 
                GiftValueInput: 'GiftValueInput',
                CurrencyTypeSelect: 'CurrencyTypeSelect',
                AlertBox: 'AlertBox',
                qrlink : '<% Response.Write(qrlink.ClientID); %>'
            });
        });
    </script>
    <style type="text/css">
        .jtable-goto-page select, .jtable-page-size-change select {
            width: auto;
            height: auto;
        }
    </style>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="NavBar" runat="server">
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="MainContent" runat="server">
    <div class="page-header">
        <h1 runat="server" id="header"></h1>

    </div>
    <div class="row">
        <div class="span3 well">
            <div class="page-header">
                <h4>Event Details</h4>
            </div>
            <div runat="server" id="AlertContainer" style="display: none;" class="alert alert-success">
                <a class="close" data-dismiss="alert">×</a>
                <span runat="server" id="AlertText"></span>
            </div>
            <div class="form-horizontal">
                <div class="control-group">
                    Event Type: <span runat="server" id="eventType"></span>
                </div>
                <div class="control-group">
                    <label for="<% Response.Write(eventName.ClientID); %>">Event Name</label>
                    <asp:TextBox runat="server" ID="eventName"></asp:TextBox>
                </div>
                <div class="control-group">
                    <label runat="server" id="MaleActorLabel" for="<% Response.Write(MaleActorInput.ClientID); %>"></label>
                    <asp:TextBox runat="server" ID="MaleActorInput"></asp:TextBox>
                </div>
                <div class="control-group">
                    <label runat="server" id="FemaleActorLabel" for="<% Response.Write(FemaleActorInput.ClientID); %>"></label>
                    <asp:TextBox runat="server" ID="FemaleActorInput"></asp:TextBox>
                </div>
                <div class="control-group">
                    <label runat="server" id="DateOfEventLabel" for="<%  Response.Write(DateOfEventInput.ClientID); %>">The date the event is taking place.</label>
                    <asp:TextBox runat="server" ID="DateOfEventInput"></asp:TextBox>
                </div>
                <div class="control-group">
                    <label runat="server" id="TimeOfEventLabel" for="<% Response.Write(TimeOfEventInput.ClientID); %>">The Time the event is taking place.</label>
                    <asp:TextBox runat="server" ID="TimeOfEventInput"></asp:TextBox>
                </div>
                <div class="control-group">
                    <asp:Label AssociatedControlID="HallInput" ID="HallLabel" runat="server" Text="The hall where the event is taking place." />
                    <asp:DropDownList ID="HallInput" CssClass="span3" runat="server" />
                </div>
                <div class="row-fluid">
                    <asp:Button Text="Update Event" OnClick="UpdateButton_Click" CssClass="btn btn-success span6" runat="server" />
                    <asp:Button Text="Delete Event" OnClick="Delete_Click" OnClientClick="return confirm('Are you sure you wish to delete this event?');" CssClass="btn btn-danger span6" runat="server" />
                </div>
            </div>
        </div>

        <div class="span8">
            <div class="row-fluid" style="margin-left: 0px;" runat="server" id="countdownRow">
                <div class="span8 offset2 well" style="text-align: center;">
                    <span runat="server" id="startCount" style="display: none;"></span>
                    <div class="lead">
                        <span runat="server" id="eventTypeSpan"></span>&nbsp;is in
                    </div>
                    <span id="counter" class="styled"></span>
                </div>
            </div>
            <div class="row-fluid well" style="margin-left: 0px;">
                <div class="span12">
                    <div class="page-header">
                        <h4>Invited Guests</h4>
                    </div>
                    <div class="row-fluid">
                        <div class="span4">
                            Total Guests Invited:
                            <asp:Label runat="server" ID="totalGuestsInvited" />
                        </div>
                        <div class="span4">
                            Total Guests Coming:
                            <asp:Label runat="server" ID="totalGuestsComing" />
                        </div>
                        <div class="span4">
                            Total Guests RSVP'd:
                            <asp:Label runat="server" ID="totalGuestsRSVPd" />
                        </div>
                    </div>
                    <div class="row-fluid">
                        <asp:TextBox runat="server" CssClass="span7" ID="GuestSearchBox" />

                        <div class="span5">
                            <button id="AddGuestButton" class="btn btn-success btn-block">Invite the guest!</button>
                        </div>
                    </div>
                    <div class="row-fluid" style="margin-top: 15px;">
                        <a id="qrlink" class="btn" href="QRCodes.aspx?eid=" runat="server">Generate RSVP QR Codes!</a>
                        <a href="CreateGuest.aspx" class="pull-right btn">Add a new guest</a>
                    </div>
                    <div class="row-fluid" style="margin-top: 20px;">
                        <div class="span12" id="GuestsTable"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- The add new guest modal -->
    <div id="addNewGuestModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h3 id="myModalLabel">Invite <span id="guestNameLabel" class="guestNameLabel"></span>to <span id="eventNameLabel" class="eventNameLabel"></span></h3>
        </div>
        <div class="modal-body">
            <label for="additionalGuestsInput">
                Please enter how many members of the family are invited
                in addition to <span class="guestNameLabel"></span>
            </label>
            <input type="number" value=" 0" id="additionalGuestsInput" />
        </div>
        <div class="modal-footer">
            <img src="img/ajax-loader-bar.gif" id="InviteGuestAjaxLoader" style="display: none;" class="pull-left" />            
            <button id="InviteGuestButton" class="btn btn-primary pull-right">Invite <span class="guestNameLabel"></span>!</button>
        </div>
    </div>

    <!-- The rsvp modal -->
    <div id="rsvpModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h3>RSVP</h3>
        </div>
        <div class="modal-body">
            <label class="checkbox">
                <input type="checkbox" id="rsvpCheckBox" /><span class="guestNameLabel"></span>'s RSVP for <span class="eventNameLabel"></span>
            </label>
            <label for="rsvpGuestsInput">
                Number of guests coming: 
            </label>
            <input id="rsvpGuestsInput" type="number" name="name" min="0" />
        </div>
        <div class="modal-footer">
            <img src="img/ajax-loader-bar.gif" id="rsvpAjaxLoader" style="display: none;" class="pull-left" />
            <button id="updateRsvpButton" class="btn btn-primary pull-right">Update RSVP</button>
        </div>
    </div>
    <!-- The Gift Modal -->
    <div id="giftModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h3><span id="GiftHeader"></span>Gift</h3>
        </div>
        <div class="modal-body">
            <div>
                <select id="GiftTypeSelect">
                    <option>Check</option>
                    <option>Cash</option>
                    <option value="GiftItem">Item</option>
                </select>
            </div>
            <input type="text" id="GiftNameInput" placeholder="Gift Name" />
            <div>
                <textarea id="DescriptionTextarea" placeholder="Gift Description"></textarea>
            </div>
            <div id="GiftValueArea">
                <input type="text" id="GiftValueInput" placeholder="Amount" />
                <select id="CurrencyTypeSelect" class="input-medium">
                    <option value="USD">$ Dollar</option>
                    <option value="ILS">₪ Shekel</option>                    
                    <option value="GBP">£ Pound</option>
                    <option value="EUR">€ Euro</option>
                    <option value="AUD">$ Australian Dollar</option>
                </select>
            </div>
            <input type="text" id="CheckDepositDate" placeholder="Deposit Date" />
            <input type="text" id="StoreBoughtInput" placeholder="Store Bought" />
            
        </div>
        <div class="modal-footer">
            <img src="img/ajax-loader-bar.gif" id="GiftLoader" style="display: none;" class="pull-left" />
            <button id="UpdateGiftBtn" class="btn btn-primary pull-right">Update Gift</button>
        </div>
    </div>
    <div id="AlertBox">

    </div>
</asp:Content>
